// 安装 Simple React Snippets插件 ，使用 imrc 再按tab键就可以自动生成导入
import React, { Component } from 'react';

class CtrlDemo extends Component {
    state = {
        txt: 'hello',
        city: 'sz',
        ischecked:true
    }
    render() {
        return (<div>
            {this.state.txt} <br/>
            {/* 1.0 文本框的演示 */}
            <input type="text" value={this.state.txt}
                onChange={e => this.setState({ txt: e.target.value })} />

            <br/>
            {/* 2.0 下拉组件的演示 */}
            {this.state.city}
            <br/>
            <select value={this.state.city} onChange={e => this.setState({city:e.target.value})}>
                <option value="gz">广州</option>
                <option value="sz">深圳</option>
            </select>
            
            <br />
            {this.state.ischecked + ''}
            <br/>
            <input type="checkbox" checked={this.state.ischecked} onChange={e => this.setState({ischecked:e.target.checked}) } />
        </div> );
    }
}
 
export default CtrlDemo;

